<template>
    <view class="pages-technician">
        <!-- <back></back> -->

        <view class="mt-md ml-md mr-md" v-for="(item, index) in list.data" :key="index">
            <technician-list-item
                from="collect"
                @comment="toShowPopup(index, 'message')"
                @collect="toCollect(index)"
                @order="toShowPopup(index, 'technician')"
                :info="item"
            >
            </technician-list-item>
        </view>

        <load-more
            :noMore="list.current_page >= list.last_page && list.data.length > 0 && location.lng"
            :loading="loading"
            v-if="loading"
        >
        </load-more>
        <abnor
            v-if="!loading && list.data.length <= 0 && list.current_page == 1 && location.lng"
        ></abnor>

        <abnor
            @confirm="$util.checkAuth({ type: 'userLocation' })"
            :tip="[{ text: '定位失败，请开启地理位置授权后刷新页面重试~', color: 0 }]"
            :button="[{ text: '开启定位', type: 'confirm' }]"
            btnSize=""
            v-if="!loading && !location.lng"
        >
        </abnor>

        <view class="space-footer"></view>

        <technician-list-popup ref="technician_list_popup"></technician-list-popup>
    </view>
</template>

<script>
import { mapState, mapActions, mapMutations } from "vuex";
import technicianListItem from "./components/technician-list-item.vue";
import technicianListPopup from "./components/technician-list-popup.vue";
export default {
    components: {
        technicianListItem,
        technicianListPopup,
    },
    data() {
        return {
            options: {},
            param: {
                page: 1,
                ser_id: 0,
                coach_name: "",
            },
            list: {
                data: [],
            },
            loading: true,
        };
    },
    computed: mapState({
        primaryColor: (state) => state.config.configInfo.primaryColor,
        subColor: (state) => state.config.configInfo.subColor,
        userInfo: (state) => state.user.userInfo,
        location: (state) => state.user.location,
    }),
    onLoad() {
        // #ifndef H5

        this.$util.showLoading();
        // #endif
        this.initIndex();
    },
    onPullDownRefresh() {
        // #ifndef APP-PLUS
        uni.showNavigationBarLoading();
        // #endif
        this.initRefresh();
        uni.stopPullDownRefresh();
    },
    onReachBottom() {
        if (this.list.current_page >= this.list.last_page || this.loading) return;
        this.param.page = this.param.page + 1;
        this.loading = true;
        this.getList();
    },
    methods: {
        ...mapActions([]),
        ...mapMutations(["updateUserItem"]),
        async initIndex(refresh = false) {
            // #ifdef H5
            if (!refresh && this.$jweixin.isWechat()) {
                await this.$jweixin.initJssdk();
                this.$jweixin.wxReady(() => {
                    this.$jweixin.hideOptionMenu();
                });
            }
            // #endif
            await this.getList();
            this.$util.setNavigationBarColor({
                bg: this.primaryColor,
            });
            uni.setNavigationBarTitle({
                title: "收藏" + this.$t("action.attendantName"),
            });
        },
        initRefresh() {
            this.param.page = 1;
            this.initIndex(true);
        },
        toSearch(val) {
            this.param.page = 1;
            this.param.coach_name = val;
            this.getList();
        },
        async getList() {
            let { location } = this;
            if (!location.lat) {
                // #ifdef H5
                if (this.$jweixin.isWechat()) {
                    this.$util.showLoading();
                    // await this.$jweixin.initJssdk();
                    await this.$jweixin.wxReady2();
                    let { latitude: lat = 0, longitude: lng = 0 } =
                        await this.$jweixin.getWxLocation();
                    location = {
                        lng,
                        lat,
                        address: "定位失败",
                        province: "",
                        city: "",
                        district: "",
                    };
                    if (lat && lng) {
                        let key = `${lat},${lng}`;
                        let data = await this.$api.base.getMapInfo({
                            location: key,
                        });
                        let { status, result } = JSON.parse(data);
                        if (status == 0) {
                            let { address, address_component } = result;
                            let { province, city, district } = address_component;
                            location = {
                                lng,
                                lat,
                                address,
                                province,
                                city,
                                district,
                            };
                        }
                    }
                }
                // #endif
                // #ifndef H5
                location = await this.$util.getBmapLocation();
                // #endif

                this.updateUserItem({
                    key: "location",
                    val: location,
                });
            }

            let { list: oldList, param } = this;
            let { lng = 0, lat = 0 } = location;
            param = Object.assign({}, param, {
                lng,
                lat,
            });
            let newList = await this.$api.mine.coachCollectList(param);
            newList.data.map((item) => {
                item.is_collect = 1;
            });
            if (this.param.page == 1) {
                this.list = newList;
            } else {
                newList.data = oldList.data.concat(newList.data);
                this.list = newList;
            }
            this.loading = false;
            this.$util.hideAll();
        },
        handerTabChange(index) {
            this.activeIndex = index;

            this.$util.showLoading();
            this.param.page = 1;
            this.getList();
        },
        async toShowPopup(index, key) {
            this.$refs.technician_list_popup.toShowPopup(this.list.data[index], key);
        },
        async toCollect(index) {
            let { id, is_collect, collect_num } = this.list.data[index];
            await this.$api.mine.delCollect({
                coach_id: id,
            });
            this.$util.showToast({
                title: "取消成功",
            });
            this.list.data.splice(index, 1);
        },
    },
};
</script>

<style lang="scss">
.pages-technician {
}
</style>
